font - size

С

Chrome

Opera

Safari

Firefox

7.0

8.0

9.0

7.0

8.0

9.6

10.0

10.0

3.1

4.0

5.0

3.0

3.6

4.0

Помилка

Так

Так

Так

Так

Так

Так

Так

Так

Так

Так

Так

Так

Так

 

Коротка інформація

CSS

CSS1, CSS2

Значення за умовчанням

medium

Наслідує

Так

Застосовується

До усіх елементів

Аналог HTML

<font size=".".>

Посилання на специфікацію

http://www.w 3.org/TR/CSS21/fonts.html#propdef - font - size

Опис

Визначає розмір шрифту елементу. Розмір може бути встановлений декількома способами. Набір констант (xx - small, x - small, small, medium, large, x - large, xx - large) задає розмір, який називається абсолютним. По правді кажучи, вони не зовсім абсолютні, оскільки залежать від налаштувань браузеру і операційної системи.

Інший набір констант (larger, smaller) встановлює відносні розміри шрифту. Оскільки розмір успадкований від батьківського елементу, ці відносні розміри застосовуються до батьківського елементу, щоб визначити розмір шрифту поточного елементу.

Зрештою, розмір шрифту сильно залежить від значення властивості font - size у батька елементу.

Синтаксис

font - size: абсолютний розмір | відносний розмір | значення | відсотки | inherit

Значення

Для завдання абсолютного розміру використовуються наступні значення: xx - small, x - small, small, medium, large, x - large, xx - large. Їх відповідність з розміром шрифту в HTML приведена в таблицю. 1.

Таблиця. 1. Розмір шрифту в CSS і HTML

CSS

xx - small

x - small

small

medium

large

x - large

xx - large

 

HTML

1

 

2

3

4

5

6

7

Відносний розмір шрифту задається значеннями larger і smaller.

Також дозволяється використовувати будь-які допустимі одиниці CSS : em (висота шрифту елементу), ex (висота символу х), пункти (pt), піксели (px), відсотки (%) та ін. За 100% береться розмір шрифту батьківського елементу. Негативні значення не допускаються.

inherit  Наслідує значення батька.

Приклад

HTML 4.01CSS 2.1IE 6IE 7IE 8Op 9.5Sa 3.1Ff 2.0Ff 3.0

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http ://www.w 3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows - 1251">
    <title>font - size</title>
    <style type="text/css">
      H1 {
        font - family: 'Times New Roman ', Times, serif; /* Гарнітура тексту */ 
        font - size: 250%; /* Розмір шрифту у відсотках */ 
      } 
      P {
        font - family: Verdana, Arial, Helvetica, sans - serif; 
        font - size: 11pt; /* Розмір шрифту в пунктах */ 
      }
    </style>
  </head> 
  <body> 
  
 <h1>Луцький національний техніний університет</h1>
  <p> Луцький національний техніний університет є одним із найкращих професійних закладів освіти у місті Луцьку. 
  Найкращою з підготовки спеціалістів є кафедра професійного навчання, що займається професійною підготовкою студентів.    .</p>  
  </body>
</html>

Результат цього прикладу показаний ні мал. 1.

Мал. 1. Застосування властивості font - size

Об'єктна модель

[window.]document.getElementById("elementID").style.fontSize

Браузери

Internet Explorer до сьомої версії включно не підтримує значення inherit.